<template>
    <div>
        <el-page-header @back="goBack" :content="$route.name"></el-page-header>
        <el-form
            class="add"
            style="margin: 20px;"
            label-width="120px"
            :model="addCampaign"
            :rules="addRules"
            ref="addCampaign"
        >
            <div class="flex">
                <el-form-item label="活动名称：" prop="name">
                    <el-input clearable v-model="addCampaign.name" placeholder="请输入活动名称"></el-input>
                </el-form-item>
                <el-form-item label="优惠券名称：" prop="coupon_name">
                    <el-input clearable v-model="addCampaign.coupon_name" placeholder="请输入优惠券名称"></el-input>
                </el-form-item>
            </div>
            <div class="flex">
                <el-form-item label="活动类型：" prop="city_type">
                    <!-- <el-input clearable v-model="addCampaign.publish" placeholder="请选择活动的范围限制"></el-input> -->
                    <el-select v-model="addCampaign.city_type" placeholder="请选择活动类型">
                        <el-option v-for="item in cityType" :key="item.id" :label="item.name" :value="item.id"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="车辆状态：" prop="run">
                    <!-- <el-input clearable v-model="addCampaign.publish" placeholder="请选择活动的用户状态限制"></el-input> -->
                    <el-select clearable v-model="addCampaign.run" placeholder="请选择享受该活动的车辆状态">
                        <el-option
                            v-for="(item,index) in runType"
                            :key="index"
                            :label="item.name"
                            :value="item.id"
                        ></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="洗车模式：" prop="wash_type">
                    <!-- <el-input clearable v-model="addCampaign.publish" placeholder="请选择活动的用户状态限制"></el-input> -->
                    <el-select clearable v-model="addCampaign.wash_type" placeholder="请选择活动限制的洗车模式">
                        <el-option
                            v-for="(item,index) in washType"
                            :key="index"
                            :label="item.name"
                            :value="item.id"
                        ></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="车辆类型：" prop="car_type">
                    <el-select clearable v-model="addCampaign.car_type" placeholder="请选择享受该活动的车辆类型">
                        <el-option
                            v-for="(item,index) in car_typeList"
                            :key="index"
                            :label="item.car_type"
                            :value="item.car_typeValue"
                        ></el-option>
                    </el-select>
                </el-form-item>
            </div>
            <div class="flex">
                <el-form-item label="外部链接：" prop="out_url">
                    <el-input clearable v-model="addCampaign.out_url" placeholder="请输入外部链接"></el-input>
                </el-form-item>
                <el-form-item label="城市：" prop="city" v-if="addCampaign.city_type === 1 || addCampaign.city_type === 2">
                    <el-select clearable v-model="addCampaign.city" @change="cityshops">
                        <el-option
                            v-for="(item,index) in cityList"
                            :key="index"
                            :label="item.city"
                            :value="item.city"
                        ></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="店铺：" prop="shop_id"  v-if="addCampaign.city_type === 2">
                    <el-select clearable v-model="addCampaign.shop_id" placeholder="请在选择城市后再选择店铺">
                        <el-option
                            v-for="(item,index) in shopname"
                            :key="index"
                            :label="item.name"
                            :value="item.id"
                        ></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="发布人：" prop="publish">
                    <el-input v-model="addCampaign.publish" clearable placeholder="请输入发布人姓名"></el-input>
                </el-form-item>
                <el-form-item label="截止时间：" prop="end_time">
                    <el-date-picker
                        v-model="addCampaign.end_time"
                        type="date"
                        :picker-options="pickerOptions"
                        value-format="yyyy-MM-dd HH:mm:ss"
                        placeholder="请选择活动的截止时间"
                    ></el-date-picker>
                </el-form-item>
            </div>
            <div class="flex">
                <el-form-item label="优惠券数量：" prop="coupon_num">
                    <el-input clearable v-model="addCampaign.coupon_num" placeholder="请输入优惠券数量"></el-input>
                </el-form-item>
                <el-form-item label="优惠券面额：" prop="coupon_money">
                    <el-input clearable v-model="addCampaign.coupon_money" placeholder="请输入优惠券面额"></el-input>
                </el-form-item>
                <el-form-item label="优惠券有效期：" prop="coupon_time">
                    <el-input clearable v-model="addCampaign.coupon_time" placeholder="请输入优惠券有效期（天）"></el-input>
                </el-form-item>
            </div>
            <div class="flex">
                <el-form-item label="备注：" prop="car_type">
                    <el-input type="textarea" clearable v-model="addCampaign.note" placeholder="请输入活动的备注说明"></el-input>
                </el-form-item>
            </div>
            <div class="flex">
                <el-form-item label="主页弹窗：" prop="homepage">
                    <el-switch v-model="addCampaign.homepage" @change="homepageChange()"></el-switch>
                </el-form-item>
                <el-form-item label="主页轮播：" prop="home_banner">
                    <el-switch v-model="addCampaign.home_banner" @change="home_bannerChange()"></el-switch>
                </el-form-item>
                <el-form-item label="个人中心轮播：" prop="my_banner">
                    <el-switch v-model="addCampaign.my_banner" @change="my_bannerChange()"></el-switch>
                </el-form-item>
                <el-form-item label="充值轮播：" prop="recharge_banner">
                    <el-switch v-model="addCampaign.recharge_banner" @change="recharge_bannerChange()"></el-switch>
                </el-form-item>
            </div>
            <el-form-item label="活动封面：" prop="cover">
                <!-- <el-upload
                    ref="cover"
                    v-model="addCampaign.cover"
                    :action="addUploadUrl"
                    list-type="picture-card"
                    :before-upload="coverUpload"
                    :on-preview="coverPreview"
                    :http-request="coverUploadEvent"
                    :on-exceed="coverExceedLimit"
                    :on-remove="coverRemove"
                > -->
                <el-upload
                    ref="cover"
                    v-model="addCampaign.cover"
                    action="/index.php/fileUpload/upload"
                    name="image"
                    :show-file-list="false"
                    list-type="picture-card"
                    :on-preview="coverPreview"
                    :on-success="handlecover"
                >
                    <img v-if="addCampaign.cover" :src="addCampaign.cover" class="avatar" />
                    <i v-else class="el-icon-plus"></i>
                </el-upload>
                <!-- <el-input v-model="addCampaign.cover" placeholder="请选择活动封面图片"></el-input> -->
            </el-form-item>
            <el-form-item label="活动内容图：" prop="content">
                <el-upload
                    ref="content"
                    v-model="addCampaign.content"
                    action="/index.php/fileUpload/upload"
                    name="image"
                    :show-file-list="false"
                    list-type="picture-card"
                    :on-preview="coverPreview"
                    :on-success="handlecontent"
                >
                    <img v-if="addCampaign.content" :src="addCampaign.content" class="avatar" />
                    <i v-else class="el-icon-plus"></i>
                </el-upload>
                <!-- <el-input v-model="addCampaign.content" placeholder="请选择活动内容图片"></el-input> -->
            </el-form-item>
            <el-form-item>
                <el-button
                    style="margin-left:50px;"
                    size="medium"
                    type="primary"
                    @click="confirm()"
                >确认添加</el-button>
            </el-form-item>
        </el-form>

        <el-dialog :visible.sync="dialogVisible">
            <img width="100%" :src="dialogImageUrl" alt />
        </el-dialog>
    </div>
</template>
<script>
import "../../../static/scss/page.scss";
import utils from "../../util/request";
import {timetamp} from "../../util/time.js"
export default {
    data() {
        return {
            addUploadUrl: "", //上传服务器路径
            dialogVisible: false, //预览图片对话框
            dialogImageUrl: "", //预览图片的路径
            pickerOptions: {
                disabledDate(time) {
                    return (
                        time.getTime() <
                        new Date().getTime() - 24 * 60 * 60 * 1000
                    );
                }
            },
            addCampaign: {
                name: "", //活动名称
                out_url: "", //外部链接
                coupon_name: "", //优惠券名称
                end_time: "", //优惠券截止时间
                coupon_num: "", //优惠券数量
                coupon_money: "", //优惠券面额
                city: "", //城市
                shop_id: "",//店铺
                car_type: "", //车辆类型
                homepage: false, //主页弹框
                home_banner: false, //主页轮播
                my_banner: false, //个人中心轮播
                recharge_banner: false, //充值轮播
                note: "",
                publish: "",
                wash_type: "",
                city_type:"",
                coupon_item: "",
                run: "",
                cover: "", //活动封面图
                content: "" //活动内容图
            },
            addRules: {
                // 表单验证
                name: [
                    {
                        required: true,
                        message: "请输入活动名称",
                        trigger: "blur"
                    }
                ],
                city: [
                    {
                        required: true,
                        message: "请选择城市",
                        trigger: "change"
                    }
                ],
                shop_id: [
                    {
                        required: true,
                        message: "请选择参加活动的店铺",
                        trigger: "change"
                    }
                ],
                car_type: [
                    {
                        required: true,
                        message: "请选择车辆类型",
                        trigger: "change"
                    }
                ],
                city_type: [
                    {
                        required: true,
                        message: "请选择活动类型",
                        trigger: "change"
                    }
                ],
                wash_type: [
                    {
                        required: true,
                        message: "请选择享受该活动的洗车模式",
                        trigger: "change"
                    }
                ],
                run: [
                    {
                        required: true,
                        message: "请选择活动参加活动的车辆状态",
                        trigger: "change"
                    }
                ],
                publish: [
                    {
                        required: true,
                        message: "请填写该活动的发起人",
                        trigger: "blur"
                    }
                ],
                end_time: [
                    {
                        required: true,
                        message: "请选择活动的截止时间",
                        trigger: "change"
                    }
                ],
                cover: [
                    {
                        required: true,
                        message: "请选择活动封面图片",
                        trigger: "change"
                    }
                ],
                content: [
                    {
                        required: true,
                        message: "请选择活动内容图片",
                        trigger: "change"
                    }
                ]
            },
            cityList: [
                {
                    city: "深圳",
                    cityValue: "深圳"
                },
                {
                    city: "北京",
                    cityValue: "北京"
                },
                {
                    city: "上海",
                    cityValue: "上海"
                },
                {
                    city: "广州",
                    cityValue: "广州"
                }
            ],
            car_typeList: [
                {
                    car_type: "小汽车",
                    car_typeValue: "小汽车"
                },
                {
                    car_type: "SUV",
                    car_typeValue: "SUV"
                },
                {
                    car_type: "MPV",
                    car_typeValue: "MPV"
                }
            ],
            cityType: [
                {id:0,name:"通用"},
                {id:1,name:"活动城市"},
                {id:2,name:"活动门店"},
            ],
            washType: [
                {id:0,name:"通用"},
                {id:1,name:"精洗"},
                {id:2,name:"快洗"},
            ],
            runType: [
                {id:0,name:"通用"},
                {id:1,name:"私家车"},
                {id:2,name:"运营车"},
            ],
            shopname: []
        };
    },
    methods: {
        goBack: function() {
            // 页头的返回
            this.$router.go(-1);
        },
        homepageChange() {
            // 主页弹框广告
            console.log("主页弹框广告");
            console.log(this.addCampaign.homepage);
        },
        home_bannerChange() {
            // 主页轮播广告
            console.log("主页轮播广告");
        },
        my_bannerChange() {
            // 个人中心轮播广告
            console.log("个人中心轮播广告");
        },
        recharge_bannerChange() {
            // 充值轮播广告
            console.log("充值轮播广告");
        },
        // 上传图片的成功的回执函数
        handlecover(resp,file,fileList){
            console.log(resp,file,fileList)
            this.addCampaign.cover = "https://dzylab.dpyun.site/storage/"+resp.data;
        },
        handlecontent(resp,file,fileList){
            console.log(resp,file,fileList)
            this.addCampaign.content = "https://dzylab.dpyun.site/storage/"+resp.data;
        },
        // 图片预览
        coverPreview(file) {
            // 点击文件列表中已上传的文件时的钩子
            console.log(file);
            this.dialogImageUrl = file.url;
            this.dialogVisible = true;
        },
        // coverExceedLimit() {
        //     // 项目图片超过数量限制事件
        //     this.$message({
        //         type: "error",
        //         message: "上传图片数量已达到限制!"
        //     });
        // },
        // coverUpload(file) {
        //     // 上传图片之前的钩子
        //     console.log(file);
        //     // return new Promise((resolve, reject) => {
        //     //     let _URL = window.URL || window.webkitURL;
        //     //     let isLt2M = file.size / 1024 / 1024 > 0.3; // 判定图片大小是否小于0.3MB
        //     //     // 这里需要计算出图片的长宽
        //     //     let img = new Image();
        //     //     img.onload = function() {
        //     //         file.width = img.width; // 获取到width放在了file属性上
        //     //         file.height = img.height; // 获取到height放在了file属性上
        //     //         let valid = img.width > 2000; // 图片宽度大于2000
        //     //         // console.log(11, file)
        //     //         // 这里我只判断了图片的宽度,compressAccurately有多个参数时传入对象
        //     //         if (valid || isLt2M) {
        //     //             compressAccurately(file, {
        //     //                 size: 100,
        //     //                 width: 690
        //     //             }).then(res => {
        //     //                 // console.log(33, res)
        //     //                 resolve(res);
        //     //             });
        //     //         } else resolve(file);
        //     //     }; // 需要把图片赋值
        //     //     img.src = _URL.createObjectURL(file);
        //     // });
        // },
        // coverUploadEvent(file) {
        //     // 图片上传至服务器
        //     console.log(file);
        //     // let formData = new FormData();
        //     // formData.append("file", file.file);
        //     // console.log(formData);
        //     // let instance = axios.create({
        //     //     baseURL: "https://admin.jljinhong.club/",
        //     //     headers: {
        //     //         Authorization: "Bearer " + localStorage.jh_token, //token
        //     //         "Content-Type": "multipart/form-data"
        //     //     }
        //     // });
        //     // instance.post("ImageUpload", formData).then(res => {
        //     //     console.log(res);
        //     //     if (res.data.code == 20000) {
        //     //         this.addCampaign.cover = res.data.data; //表单里的图片路径
        //     //         console.log(this.addCampaign.cover);
        //     //     }
        //     //     if (res.data.code == 20004) {
        //     //         this.$message({
        //     //             type: "error",
        //     //             message: "请重新登录!"
        //     //         });
        //     //         this.$router.push({ path: "/" });
        //     //     }
        //     //     if (res.data.code == 20008) {
        //     //         this.$message({
        //     //             type: "error",
        //     //             message: "图片过大，请上传小于5M的图片!"
        //     //         });
        //     //     }
        //     // });
        // },
        // coverRemove: function(file, fileList) {
        //     // 上传完成时在文件列表里移除的事件
        //     console.log(file, fileList);
        //     // let src = this.addCampaign.cover;
        //     // let indexOf = src.lastIndexOf("/"); //找到图片路径的最后一个斜杠
        //     // let fileName = src.substring(indexOf + 1); //最后一个斜杠加一表示找到了图片的名字中的第一位
        //     // console.log(fileName);
        //     // request
        //     //     .request("ImageDELETE?fileName=" + fileName, "delete")
        //     //     .then(res => {
        //     //         console.log(res);
        //     //         if (res.data.code == 20000) {
        //     //             this.$message({
        //     //                 type: "success",
        //     //                 message: "删除成功!"
        //     //             });
        //     //             this.addCampaign.cover = ""; //表单里的图片路径为空
        //     //         }
        //     //         if (res.data.code == 20001) {
        //     //             this.$message({
        //     //                 type: "error",
        //     //                 message: "删除失败或文件不存在！"
        //     //             });
        //     //         }
        //     //     });
        // },
        // contentPreview(file) {
        //     // 点击文件列表中已上传的文件时的钩子
        //     console.log(file);
        //     this.dialogImageUrl = file.url;
        //     this.dialogVisible = true;
        // },
        // contentExceedLimit() {
        //     // 项目图片超过数量限制事件
        //     this.$message({
        //         type: "error",
        //         message: "上传图片数量已达到限制!"
        //     });
        // },
        // contentUpload(file) {
        //     // 上传图片之前的钩子
        //     console.log(file);
        //     // return new Promise((resolve, reject) => {
        //     //     let _URL = window.URL || window.webkitURL;
        //     //     let isLt2M = file.size / 1024 / 1024 > 0.3; // 判定图片大小是否小于0.3MB
        //     //     // 这里需要计算出图片的长宽
        //     //     let img = new Image();
        //     //     img.onload = function() {
        //     //         file.width = img.width; // 获取到width放在了file属性上
        //     //         file.height = img.height; // 获取到height放在了file属性上
        //     //         let valid = img.width > 2000; // 图片宽度大于2000
        //     //         // console.log(11, file)
        //     //         // 这里我只判断了图片的宽度,compressAccurately有多个参数时传入对象
        //     //         if (valid || isLt2M) {
        //     //             compressAccurately(file, {
        //     //                 size: 100,
        //     //                 width: 690
        //     //             }).then(res => {
        //     //                 // console.log(33, res)
        //     //                 resolve(res);
        //     //             });
        //     //         } else resolve(file);
        //     //     }; // 需要把图片赋值
        //     //     img.src = _URL.createObjectURL(file);
        //     // });
        // },
        // contentUploadEvent(file) {
        //     // 图片上传至服务器
        //     console.log(file);
        //     // let formData = new FormData();
        //     // formData.append("file", file.file);
        //     // console.log(formData);
        //     // let instance = axios.create({
        //     //     baseURL: "https://admin.jljinhong.club/",
        //     //     headers: {
        //     //         Authorization: "Bearer " + localStorage.jh_token, //token
        //     //         "Content-Type": "multipart/form-data"
        //     //     }
        //     // });
        //     // instance.post("ImageUpload", formData).then(res => {
        //     //     console.log(res);
        //     //     if (res.data.code == 20000) {
        //     //         this.addCampaign.cover = res.data.data; //表单里的图片路径
        //     //         console.log(this.addCampaign.cover);
        //     //     }
        //     //     if (res.data.code == 20004) {
        //     //         this.$message({
        //     //             type: "error",
        //     //             message: "请重新登录!"
        //     //         });
        //     //         this.$router.push({ path: "/" });
        //     //     }
        //     //     if (res.data.code == 20008) {
        //     //         this.$message({
        //     //             type: "error",
        //     //             message: "图片过大，请上传小于5M的图片!"
        //     //         });
        //     //     }
        //     // });
        // },
        // contentRemove: function(file, fileList) {
            // 上传完成时在文件列表里移除的事件
            // console.log(file, fileList);
            // let src = this.addCampaign.cover;
            // let indexOf = src.lastIndexOf("/"); //找到图片路径的最后一个斜杠
            // let fileName = src.substring(indexOf + 1); //最后一个斜杠加一表示找到了图片的名字中的第一位
            // console.log(fileName);
            // request
            //     .request("ImageDELETE?fileName=" + fileName, "delete")
            //     .then(res => {
            //         console.log(res);
            //         if (res.data.code == 20000) {
            //             this.$message({
            //                 type: "success",
            //                 message: "删除成功!"
            //             });
            //             this.addCampaign.cover = ""; //表单里的图片路径为空
            //         }
            //         if (res.data.code == 20001) {
            //             this.$message({
            //                 type: "error",
            //                 message: "删除失败或文件不存在！"
            //             });
            //         }
            //     });
        // },
        confirm() {
            // 确认添加
            // 判断优惠券名称是否为空 验证状态重新定义（验证的开启和取消）
            if (this.addCampaign.coupon_name != "") {
                this.addRules = {
                    // 表单验证
                    name: [
                        {
                            required: true,
                            message: "请输入活动名称",
                            trigger: "blur"
                        }
                    ],
                    coupon_name: [
                        {
                            required: true,
                            message: "请输入优惠券名称",
                            trigger: "blur"
                        }
                    ],
                    coupon_num: [
                        {
                            required: true,
                            message: "请输入优惠券数量",
                            trigger: "blur"
                        }
                    ],
                    coupon_money: [
                        {
                            required: true,
                            message: "请输入优惠券面额",
                            trigger: "blur"
                        }
                    ],
                    coupon_time: [
                        {
                            required: true,
                            message: "请输入优惠券领取后的有效期",
                            trigger: "blur"
                        }
                    ],
                    city: [
                        {
                            required: true,
                            message: "请选择城市",
                            trigger: "change"
                        }
                    ],
                    shop_id: [
                        {
                            required: true,
                            message: "请选择参加活动的店铺",
                            trigger: "change"
                        }
                    ],
                    car_type: [
                        {
                            required: true,
                            message: "请选择车辆类型",
                            trigger: "change"
                        }
                    ],
                    city_type: [
                        {
                            required: true,
                            message: "请选择活动类型",
                            trigger: "change"
                        }
                    ],
                    wash_type: [
                        {
                            required: true,
                            message: "请选择享受该活动的洗车模式",
                            trigger: "change"
                        }
                    ],
                    run: [
                        {
                            required: true,
                            message: "请选择活动参加活动的车辆状态",
                            trigger: "change"
                        }
                    ],
                    publish: [
                        {
                            required: true,
                            message: "请填写该活动的发起人",
                            trigger: "blur"
                        }
                    ],
                    end_time: [
                        {
                            required: true,
                            message: "请选择活动的截止时间",
                            trigger: "change"
                        }
                    ],
                    cover: [
                        {
                            required: true,
                            message: "请选择活动封面图片",
                            trigger: "change"
                        }
                    ],
                    content: [
                        {
                            required: true,
                            message: "请选择活动内容图片",
                            trigger: "change"
                        }
                    ]
                };
            } else {
                this.addRules = {
                    // 表单验证
                    name: [
                        {
                            required: true,
                            message: "请输入活动名称",
                            trigger: "blur"
                        }
                    ],
                    coupon_name: [
                        {
                            required: false,
                            message: "请输入优惠券名称",
                            trigger: "blur"
                        }
                    ],
                    coupon_num: [
                        {
                            required: false,
                            message: "请输入优惠券数量",
                            trigger: "blur"
                        }
                    ],
                    coupon_money: [
                        {
                            required: false,
                            message: "请输入优惠券面额",
                            trigger: "blur"
                        }
                    ],
                    coupon_time: [
                        {
                            required: false,
                            message: "请输入优惠券领取后的有效期",
                            trigger: "blur"
                        }
                    ],
                    city: [
                        {
                            required: true,
                            message: "请选择城市",
                            trigger: "change"
                        }
                    ],
                    shop_id: [
                        {
                            required: true,
                            message: "请选择参加活动的店铺",
                            trigger: "change"
                        }
                    ],
                    car_type: [
                        {
                            required: true,
                            message: "请选择车辆类型",
                            trigger: "change"
                        }
                    ],
                    city_type: [
                        {
                            required: true,
                            message: "请选择活动类型",
                            trigger: "change"
                        }
                    ],
                    wash_type: [
                        {
                            required: true,
                            message: "请选择享受该活动的洗车模式",
                            trigger: "change"
                        }
                    ],
                    run: [
                        {
                            required: true,
                            message: "请选择活动参加活动的车辆状态",
                            trigger: "change"
                        }
                    ],
                    publish: [
                        {
                            required: true,
                            message: "请填写该活动的发起人",
                            trigger: "blur"
                        }
                    ],
                    end_time: [
                        {
                            required: true,
                            message: "请选择活动的截止时间",
                            trigger: "change"
                        }
                    ],
                    cover: [
                        {
                            required: true,
                            message: "请选择活动封面图片",
                            trigger: "change"
                        }
                    ],
                    content: [
                        {
                            required: true,
                            message: "请选择活动内容图片",
                            trigger: "change"
                        }
                    ]
                };
            }
            this.$refs["addCampaign"].validate(valid => {
                if (valid) {
                    let that = this;
                    let data = {};
                    for(var i in this.addCampaign) this.addCampaign[i] !== '' ? data[i] = this.addCampaign[i] : '';
                    data.end_time = timetamp(data.end_time)
                    // console.log(data)
                    utils.request("/activity/add","post",JSON.stringify(data)).then(resp=>{
                        console.log(resp)
                        that.$router.push("/campaign")
                    })
                } else {
                    console.log("error submit!!");
                    return false;
                }
            });
        },
        
        cityshops(val){
            console.log(val,this.addCampaign.city)
            // let city;
            // this.cityList.forEach(item => {
            //     item.id === val ? city = item.city : "";
            // });
            utils.request("/shop/list","post",JSON.stringify({page:1,list_rows:999999999,city:String(val)})).then(resp=>{
                console.log(resp)
                this.shopname = resp.data.data.data.map((item)=>{
                    return{
                        id: item["id"],
                        name: item["name"],
                        city: item["city"]
                    }
                })
                console.log(this.shopname)
            })
            
        }
    },
    created(){
        // utils.request("/shop/list","post",JSON.stringify({page:1,list_rows:999999999})).then(resp=>{
        //     console.log(resp.data.data.data)
        //     this.shopname = resp.data.data.data.map((item)=>{
        //         return{
        //             id: item["id"],
        //             name: item["name"],
        //             city: item["city"]
        //         }
        //     })
        //     console.log(this.shopname)
        // })
        utils.request("/city/list","post",JSON.stringify({page:1,list_rows:999999999})).then(resp=>{
            // console.log(resp)
            this.cityList = resp.data.data.data.map((item)=>{
                return{
                    id: item["id"],
                    city: item["city"],
                    first: item["first"]
                }
            })
        })
        // cityList
    },
    mounted() {},
};
</script>



<style lang="scss" scoped>
.flex {
    display: flex;
    flex-flow: row wrap;
}
.avatar {
    //图片大小
    width: 100%;
    height: 100%;
    display: block;
}
</style>

